import React, { Component } from 'react';
import { WeaLocaleProvider } from 'ecCom';

const getLabel = WeaLocaleProvider.getLabel;
export default class SysRemind extends Component {
  static defaultProps = {
    languageId: '7',
  }
  render() {
    let { languageId } = this.props;
    let labelid = parseInt((this.getQueryString('labelid') == null ? this.getQueryString('labelid') : this.getQueryString('labelid')), 0);
    let msg = getLabel(labelid, languageId);
    let other = false;
    let other2 = false;
    let browserName;
    let browserVersion;
    let minVersion;
    let browserOS;
    const labelid1 = [1, 2, 3, 4, 5, 12345, 123456, 129755, 129757, -99999];
    const labelid2 = [1, 2, 3, 4, 5, 12345, 123456, 129755, 129757, -99999, 27889, 27890, 124796];
    if (labelid1.indexOf(labelid) === -1) {
      other = true;
    }
    if (labelid2.indexOf(labelid) === -1) {
      other2 = true;
    }
    if (labelid === 1) { // 浏览器版本不支持提醒
      // String browserName=Util.null2String(request.getParameter("browserName"));
      browserName = this.getQueryString('browserName') ? this.getQueryString('browserName') : '';
      browserVersion = this.getQueryString('browserVersion');
      minVersion = '';
      if (browserName === 'IE') { minVersion = 'IE 8'; } else if (browserName === 'FF') { minVersion = 'Firefox 9'; } else if (browserName === 'Chrome') { minVersion = 'Chrome 14'; } else if (browserName === 'Safari') { minVersion = 'Safari 5'; }
    }
    if (labelid === 2) { // 移动设备访问提醒
      browserOS = this.getQueryString('browserOS') ? this.getQueryString('browserOS') : '';
    }
    if (labelid === 3) {
      browserOS = this.getQueryString('browserOS') ? this.getQueryString('browserOS') : '';
      browserName = this.getQueryString('browserName') ? this.getQueryString('browserName') : '';
    }
    if (labelid === -99999) {
      this.finalDo();
    }
    return (
      <div id="messageArea" style={{ width: '100%', position: 'obsolute', marginTop: '10%' }} align="center">
        <div style={{ width: '800px', fontFamily: '微软雅黑', fontSize: '16px', height: '247px', border: '1px solid #e2e2e2', textAlign: 'left' }} align="center">
          <div style={{ float: 'left' }}>
            <div style={{ height: '80px', width: '80px', background: 'url(/wui/common/page/images/error_left_wev8.png)', marginTop: '80px', marginLeft: '40px!important', marginLeft: '20px' }} />
          </div>
          <div style={{ height: '205px', borderLeft: 'solid 1px #e8e8e8', margin: '20px', marginTop: '22px', float: 'left', marginLeft: '40px' }} />
          <div style={{ height: '260px', width: '610px', float: 'left', lineHeight: '25px' }}>
            {labelid === 1 &&
              <p style={{ fontWeight: 'normal', color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>{`${getLabel(125379, '您当前的浏览器是') + browserName + getLabel(127923, '浏览器， 版本是') + browserVersion}，${getLabel(125382, '版本过低')}，${getLabel(125383, '请升级')}${browserName}${getLabel(15322, '至')}`}
                <span style={{ color: '#ff3000' }}>{minVersion}</span>
                {getLabel(125384, '以上，或者使用其他浏览器！')}<br />
                <a href="http://windows.microsoft.com/zh-CN/internet-explorer/products/ie/home" style={{ textDecoration: 'underline !important' }}>IE</a>&nbsp;
                <a href="http://www.google.cn/chrome/intl/zh-CN/landing_chrome.html" style={{ textDecoration: 'underline !important' }}>Chrome</a>&nbsp;
                <a href="http://www.firefox.com.cn/download/" style={{ textDecoration: 'underline !important' }}>Firefox</a>&nbsp;
                <a href="http://www.apple.com.cn/safari/download/" style={{ textDecoration: 'underline !important' }}>Safari</a>
              </p>}
            {labelid === 2 &&
              <p style={{ fontWeight: 'normal', color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                {getLabel(125385, '很抱歉当前系统暂不支持')}
                <span style={{ color: '#ff3000' }}>{browserOS}</span>
                {getLabel(127924, '访问，移动设备请使用E-Mobile访问！')}
              </p>
            }
            {labelid === 3 &&
              <p style={{ fontWeight: 'normal', color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                {getLabel(125385, '很抱歉当前系统暂不支持')}<span style={{ color: '#ff3000' }}>{browserOS + getLabel(127926, '系统下') + browserName + getLabel(125380, '浏览器')}</span>{getLabel(127927, '访问，请使用IE或chrome访问！')}
              </p>
            }
            {labelid === 4 &&
              (<p><object name="AXDemo" id="AXDemo" height="0" width="0" classID="clsid:B248518D-6707-4710-BE96-7063C501A9F4" codebase="/weaverplugin/DownloadFilePrj.ocx" />
                <p id="msg" style={{ fontWeight: 'normal', color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                  {getLabel(127928, '您当前的浏览器是IE浏览器版本过低，请升级IE至')}<span style={{ color: '#ff3000' }}>IE8</span>
                  {getLabel(125384, '以上，或者使用其他浏览器！')}<br />
                </p>
                <p style={{ marginBlockStart: '1em', marginBlockEnd: '1em' }}>{confirm(`${getLabel(127929, '您的IE版本低于IE8,只有IE8及以上版本可以访问,是否安装IE8?')}`) ? this.isConfirm() : ''}</p></p>)
            }
            {labelid === 5 &&
              <p id="msg" style={{ fontWeight: 'normal', color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                {getLabel(127933, '您当前的浏览器没有安装office多浏览器插件，请安装插件后在非IE上进行文档操作。')}
                <a href="/weaverplugin/iWebPlugin.exe">{getLabel(7171, '插件下载')}</a><br />
              </p>}
            {labelid === 123456 &&
              <p id="msg" style={{ fontWeight: 'normal', color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                {getLabel(127934, '您开启了')}'<span style={{ color: '#ff3000' }}>{getLabel(127935, 'office文档在线预览')}</span>'{getLabel(127936, '功能，但配置出现问题。请联系管理员检查服务器端配置。')}
              </p>
            }
            {labelid === 129755 &&
              <p id="msg" style={{ fontWeight: 'normal', color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }} >
                {getLabel(129755, '您查看的文档不能直接打开，请下载后查看')}
              </p>
            }
            {labelid === 129757 &&
              <p id="msg" style={{ fontWeight: 'normal', color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                {getLabel(129757, '您查看的文档不能直接打开，请联系创建人获取权限后下载查看')}
              </p>
            }
            {labelid === -99999 &&
              <p id="msg" style={{ fontWeight: 'normal', color: '#fe9200', marginTop: '75px', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                {getLabel(127937, '您查看的文档过大，请下载文档后查看。')}
              </p>
            }
            {other &&
              (
                <p>
                  <p style={{ fontWeight: 'normal', color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>{getLabel(127938, '	很抱歉，当前浏览器暂不支持')}'<span style={{ color: '#ff3000' }}>{msg}</span>'。</p>
                  {(labelid === 27889 || labelid === 27890) &&
                    (<p style={{ color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                      {getLabel(125386, '请使用IE8或IE8以上版本访问。') + getLabel(125387, '或者跳转到')}
                      <a href="/wui/theme/ecology7/page/skinSetting.jsp?skin=default&theme=ecologyBasic">{getLabel(125388, 'EcologyBasic主题')}</a>
                    </p>)}
                  {labelid === 124796 &&
                    (<p><p style={{ color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                      {getLabel(127939, '请使用IE9及IE9以上版本或Chrome浏览器访问')}
                    </p>
                      <p style={{ color: '#8f8f8f', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                        {getLabel(127942, '不支持原因：由于此功能基于HTML5实现， 我们正在努力的寻求解决方案，')}
                      </p>
                      <p style={{ color: '#8f8f8f', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                        {getLabel(127941, '使其能在多浏览器下运行，给您造成的不便敬请谅解。')}
                      </p></p>)
                  }
                  {other2 &&
                    (<p><p style={{ color: '#fe9200', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                      {getLabel(125386, '请使用IE8或IE8以上版本访问。')}
                    </p>
                      <p style={{ color: '#8f8f8f', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                        {getLabel(127943, '不支持原因：由于此功能依赖于IE浏览器的Activex， 我们正在努力的寻求解决方案，')}
                      </p>
                      <p style={{ color: '#8f8f8f', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
                        {getLabel(127941, '使其能在多浏览器下运行，给您造成的不便敬请谅解。')}
                      </p></p>)
                  }
                </p>)}
            <p style={{ color: '#8f8f8f', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
              {getLabel(127944, '	如有疑问请联系系统管理员。')}
            </p>
          </div>
        </div>
      </div>
    );
  }
  getQueryString = (name) => {
    const reg = new RegExp(`(^|&)${name}=([^&]*)(&|$)`, 'i');
    const r = window.location.href.split('?')[1].match(reg);
    if (r != null) {
      return unescape(r[2]);
    }
    return null;
  }
  finalDo = () => {
    let loading = top.document.getElementById('loading');
    if (loading) {
      try {
        top.document.getElementById('loading').style.display = 'none';
        // top.finalDo("view");
      } catch (e) {
        alert(e);
      }
    } else {
      window.setTimeout(() => { finalDo(); }, 200);
    }
  }
  isConfirm = () => {
    document.querySelector('#msg').html(`${getLabel(127930, '请稍等，正在下载IE8，请勿关闭窗口')}`);
    try {
      AXDemo.DownloadFileByUrl(`${window.location.protocol}//${window.location.host}/weaverplugin/IE8-WindowsXP-x86-CHS.exe`); // 下载IE8
      document.querySelector('#msg').html(`${getLabel(127931, '请稍等，操作系统正在安装IE8，安装成功之后，请重启操作系统后访问。')}`);
    } catch (e) {
      document.querySelector('#msg').html(`${getLabel(127928, '您当前的浏览器是IE浏览器版本过低，请升级IE至')}<span style="color: red;">IE8</span>` + `${getLabel(125384, '以上，或者使用其他浏览器！')}` + '<span style="color: red;"><br>\'');
      alert(`${getLabel(127932, '请先安装提示信息中Activex控件后再访问该页面')}`);
    }
  }
}
